import { Link } from "react-router";
import type { Issue } from "../types/issue";
import { Button, Flex } from "antd";
type Props = Issue
export const IssueCard = (props: Props) => (
    <Link to={"/issue/" + props._id}>
        <Flex
        gap={30}
        align="center"
        style={{borderBottom: "1px solid #000", paddingBottom:20}}
        >
            <Flex vertical align="center" gap={3}>
                <div>1</div>
                <div>回答</div>
            </Flex>
            <Flex vertical align="center" gap={3}>
                <div>{props.pv}</div>
                <div>浏览</div>
            </Flex>
            <Flex vertical flex={1} gap={40}>
                <Flex>{props.title}</Flex>
                <Flex gap={20}>
                    <Button color={props.type.color} variant="solid" size="small">
                        {props.type.typename}
                    </Button>
                    <Button 
                    size="small"
                    color="orange"
                    variant="solid"
                    style={{marginLeft: "auto"}}
                    >
                        {props.user.nickname}
                    </Button>
                    <div className="time">
                        {new Date(props.createdAt).toLocaleDateString()}
                    </div>
                </Flex>
            </Flex>
        </Flex>
    </Link>
)